//----------气泡设置----------------------------------------

//字符串截取
function wordLength(value) {
    var ret = ""; //拼接加\n返回的类目项
    var maxLength = 4; //每项显示文字个数
    var valLength = value.length; //X轴类目项的文字个数
    var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
    if (rowN > 1) //如果类目项的文字大于3,
    {
        for (var i = 0; i < rowN; i++) {
            var temp = ""; //每次截取的字符串
            var start = i * maxLength; //开始截取的位置
            var end = start + maxLength; //结束截取的位置
            //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
            temp = value.substring(start, end) + "\n";
            ret += temp; //凭借最终的字符串
        }
        return ret;
    } else {
        return value;
    }
}
//
var data1 = [{
    name: "生产矿井",
    value: "1"
},
{
    name: "新建矿井",
    value: "2"
},
{
    name: "新建矿井",
    value: "3"
},
{
    name: "新建矿井",
    value: "4"
},
{
    name: "新建矿井",
    value: "5"
},
{
    name: "新建矿井",
    value: "6"
},
{
    name: "新建矿井",
    value: "7"
},
{
    name: "停产矿井",
    value: "8"
}

];
var offsetData1 = [
    [80, 53],
    [39, 53],
    [20, 23],
    [10, 73],
    [10, 43],
    [50, 80],
    [63, 35],
    [83, 20],
];
//symbolSize 散点气泡大小
var symbolSizeData1 = [100, 85, 75, 92, 87, 78, 77, 95];

//循环定义series的data值
function addqipao(data, offsetData, symbolSizeData) {
    var datas = [];
    for (var i = 0; i < data.length; i++) {
        var item = data[i];
        datas.push({
            name: wordLength(item.name) + "\n" + item.value + "人",
            value: offsetData[i],
            symbolSize: symbolSizeData[i],
            label: {
                normal: {
                    textStyle: {
                        fontSize: 14
                    }
                }
            },
            itemStyle: {
                normal: {
                    color: new echarts.graphic.RadialGradient(0.5, 0, 1, [{
                        offset: 0.03,
                        color: 'rgba(30, 136, 207, 0.23)'
                    },
                    {
                        offset: 0.96,
                        color: 'rgba(11, 243, 178, 0.29)'
                    }
                    ]),
                    opacity: 0.8,
                    shadowColor: '#409eff',
                    shadowBlur: 10,
                    shadowOffsetX: 1,
                    shadowOffsetY: 1,
                },

            }
        });
    }
    return datas
}

var qipaodt22 = addqipao(data1, offsetData1, symbolSizeData1)

//------------------------------------------------------------

var ec_center_qp = echarts.init(document.getElementById('detailsQp'));
var ec_center_qp_option = {
    title:
        [
            {
                id: 'statistic',
                text: "境外待确认",
                left: '70%',
                top: '8%',
                textStyle: {
                    color: '#fff',
                    fontSize: 15
                }
            }
        ],

    xAxis: [{
        gridIndex: 0,
        type: "value",
        show: false,
        min: 0,
        max: 100,
        nameLocation: "middle",
        nameGap: 5
    }],

    yAxis: [{
        gridIndex: 0,
        min: 0,
        show: false,
        max: 100,
        nameLocation: "middle",
        nameGap: 30
    }],

    // backgroundColor: '#EDF5FF',
    grid: {
        show: false,
        top: 0,
        bottom: 0,
        left: 20,
    },

    series: [{
        type: "scatter",
        symbol: "circle",
        symbolSize: 120,
        label: {
            normal: {
                show: true,
                formatter: "{b}",
                color: "#fff",
                textStyle: {
                    fontSize: "20"
                }
            }
        },

        itemStyle: {
            normal: {
                color: "#00acea"
            }
        },
        data: qipaodt22,
        // data: []
    }]

}

window.addEventListener("resize", function () {
    ec_center_qp.resize();
});

ec_center_qp.setOption(ec_center_qp_option);